<!DOCTYPE HTML>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <title>旅游管理系统</title>
    <link th:href="@{/css/bootstrap.css}" rel='stylesheet' type='text/css'/>
    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <!-- Custom Theme files -->
    <link th:href="@{/css/style.css}" rel='stylesheet' type='text/css'/>
    <!-- Custom Theme files -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <script type="application/x-javascript"> addEventListener("load", function () {
        setTimeout(hideURLbar, 0);
    }, false);

    function hideURLbar() {
        window.scrollTo(0, 1);
    } </script>
    <!--webfont-->
    <script type="text/javascript" th:src="@{/js/jquery-1.11.1.min.js}"></script>
    <script type="text/javascript" th:src="@{/js/login.js}"></script>
    <script th:src="@{/js/jquery.easydropdown.js}"></script>
    <script th:src="@{/js/wow.min.js}"></script>
    <link th:href="@{/css/animate.css}" rel='stylesheet' type='text/css'/>
    <link th:href="@{/css/custom.css}" rel='stylesheet' type='text/css'/>
    <script>
        new WOW().init();
    </script>
</head>
<body>
<div class="header">
    <div class="col-sm-8 header-left">
        <div class="logo">
            <a th:href="@{/}"><img th:src="@{/images/logo.png}" alt=""/></a>
        </div>
        <div class="menu">
            <a class="toggleMenu" href="javascript:void(0);"><img th:src="@{/images/nav.png}" alt=""/></a>
            <ul class="nav" id="nav">
                <li><a href="/source">旅游资源</a></li>
                <li class="active"><a href="/service">服务设施</a></li>
                <li><a href="/shop">购物信息</a></li>
                <li>
                    <a th:if="${session.user == null}" href="/tologin">登录</a>
                    <a th:if="${session.user != null}" href="/order">我的预定</a>
                </li>
                <li>
                    <a th:if="${session.user == null}" href="/toregist">注册</a>
                    <a th:if="${session.user != null}" th:href="@{/logout}">退出</a>
                </li>
                <div class="clearfix"></div>
            </ul>
            <script type="text/javascript" th:src="@{/js/responsive-nav.js}"></script>
        </div>
    </div>
    <div class="col-sm-4 header_right">
        <div id="loginContainer">
            <a href="javascript:void(0);" id="loginButton">
                <img th:src="@{/images/login.png}">
                <a th:if="${session.user == null}" th:href="@{/tologin}" style="font-size: 14px;color: #ffffff">未登录</a>
                <span th:if="${session.user != null}" th:text="${session.user.u_name}">未登录</span>
            </a>
        </div>
        <div class="clearfix"></div>
    </div>
    <div class="clearfix"></div>
</div>
<div class="banner2">
</div>
<div class="content_top">
    <div class="container">
        <div class="col-md-4 bottom_nav">
            <div class="css_search">
                <input type="search" id="key" th:value="${key}" placeholder="搜索...">
            </div>
        </div>
        <div class="col-md-4 col-md-offset-4 content_dropdown1">
            <div class="content_dropdown">
                <select class="dropdown" tabindex="10" id="type" data-settings='{"wrapperClass":"metro"}'>
                    <option value="0">全部类别</option>
                    <option value="1" th:selected="${type == 1}">旅团</option>
                    <option value="2" th:selected="${type == 2}">旅馆</option>
                    <option value="3" th:selected="${type == 3}">车站</option>
                    <option value="4" th:selected="${type == 4}">监督机构</option>
                </select>
            </div>
        </div>
    </div>
</div>
<div class="living_middle">
    <div class="container">
        <div class="col-md-12 wow fadeInLeft" data-wow-delay="0.4s">
            <div class="educate_grid">
                <div class="col-md-4 room-grid" th:each="se,seStat : ${pageInfo.list}">
                    <div class="living_box" th:if="${(seStat.count) ge 1 && (seStat.count) le 3}">
                        <a th:href="@{/service/detail(id=${se.se_id})}">
                            <img th:src="${se.se_image_pre}" class="img-responsive" alt=""/>
                            <span class="sale-box">
                                <span class="sale-label" th:if="${se.se_cate == 1}">旅团</span>
                                <span class="sale-label" th:if="${se.se_cate == 2}">旅馆</span>
                                <span class="sale-label" th:if="${se.se_cate == 3}">车站</span>
                                <span class="sale-label" th:if="${se.se_cate == 4}">监督机构</span>
                            </span>
                        </a>
                        <div class="living_desc desc1">
                            <h3><a href="#"><span th:text="${se.se_name}"></span></a></h3>
                            <p><span th:text="${se.se_des_pre}">Lorem ipsum consectetuer adipiscing </span></p>
                            <p class="educate"><img src="images/star1.png" alt=""/></p>
                            <p class="price pr_box"></p>
                            <div class="clearfix"></div>
                        </div>
                    </div>
                </div>
                <div class="clearfix"></div>
            </div>
        </div>
        <div class="col-md-12 wow fadeInRight" data-wow-delay="0.4s">
            <div class="educate_grid">
                <div class="col-md-4 room-grid" th:each="se,seStat : ${pageInfo.list}">
                    <div class="living_box" th:if="${(seStat.count) ge 4 && (seStat.count) le 6}">
                        <a th:href="@{/service/detail(id=${se.se_id})}">
                            <img th:src="${se.se_image_pre}" class="img-responsive" alt=""/>
                            <span class="sale-box">
                                <span class="sale-label" th:if="${se.se_cate == 1}">旅团</span>
                                <span class="sale-label" th:if="${se.se_cate == 2}">旅馆</span>
                                <span class="sale-label" th:if="${se.se_cate == 3}">车站</span>
                                <span class="sale-label" th:if="${se.se_cate == 4}">监督机构</span>
                            </span>
                        </a>
                        <div class="living_desc desc1">
                            <h3><a href="#"><span th:text="${se.se_name}">aliquam volutp</span></a></h3>
                            <p><span th:text="${se.se_des_pre}">Lorem ipsum consectetuer adipiscing </span></p>
                            <p class="educate"><img src="images/star1.png" alt=""/></p>
                            <p class="price pr_box"></p>
                            <div class="clearfix"></div>
                        </div>
                    </div>
                </div>
                <div class="clearfix"></div>
            </div>
            <div class="educate_grid">
                <div class="col-md-4 room-grid" th:each="se,seStat : ${pageInfo.list}">
                    <div class="living_box" th:if="${(seStat.count) ge 7 && (seStat.count) le 9}">
                        <a th:href="@{/service/detail(id=${se.se_id})}">
                            <img src="images/e1.jpg" class="img-responsive" alt=""/>
                            <span class="sale-box">
                                <span class="sale-label">Balcony</span>
                            </span>
                        </a>
                        <div class="living_desc desc1">
                            <h3><a href="#"><span th:text="${se.se_name}">aliquam volutp</span></a></h3>
                            <p><span th:text="${se.se_des_pre}">Lorem ipsum consectetuer adipiscing </span></p>
                            <p class="educate"><img src="images/star1.png" alt=""/></p>
                            <p class="price pr_box"></p>
                            <div class="clearfix"></div>
                        </div>
                    </div>
                </div>
                <div class="clearfix"></div>
            </div>
        </div>
    </div>
    <div class="container">
        <div class="row">
            <!-- Pagination Area Start -->
            <nav aria-label="Page navigation">
                <ul class="pagination" >
                    <!--上一页 start-->
                    <li><a th:if="${pageInfo.pageNum eq 1}" href="javascript:void(0);"
                           aria-label="Previous">上一页</a></li>
                    <li><a th:if="${pageInfo.pageNum gt 1}"
                           th:href="@{/service(key=${key}, type=${type},currentPage=${pageInfo.pageNum - 1})}"
                           aria-label="Previous">上一页</a></li>
                    <!--上一页 end-->
                    <span th:each="currentPage : ${pageInfo.navigatepageNums}">
                            <li><a th:href="@{/service(key=${key}, type=${type},currentPage=${currentPage})}" th:text="${currentPage}"></a></li>
                            </span>
                    <!--下一页 start-->

                    <li><a th:if="${pageInfo.pageNum eq pageInfo.pages}" href="javascript:void(0);"
                           aria-label="Previous">下一页</a></li>
                    <li><a th:if="${pageInfo.pageNum lt pageInfo.pages}"
                           th:href="@{/service(key=${key}, type=${type},currentPage=${pageInfo.pageNum + 1})}"
                           aria-label="Previous">下一页</a></li>
                    <!--下一页 end-->
                </ul>
            </nav>
            <!-- Pagination Area End -->
        </div>
    </div>
</div>
<div class="living_bottom">
    <div class="container">
        <h2 class="title block-title">至尊推荐</h2>
        <div class="col-md-6 post_left wow fadeInLeft" data-wow-delay="0.4s">
            <div class="mask1"><img src="images/pic4.jpg" alt="image" class="img-responsive zoom-img"/></div>
            <p> 酒店星级的划分以酒店的建筑、设施设备、功能及管理、服务水平为依据。具体的评定办法按照国家旅游局颁发的设施设备评定标准、设施设备的维修保养评定标准、清洁卫生评定标准，宾客意见评定标准等执行。
                <a th:href="@{/service/detail(id=1)}">查看详情</a></p>
            <div class="divider"></div>
            <p class="field-content">豪泰酒店</span></p>
        </div>
        <div class="col-md-6 post_left wow fadeInRight" data-wow-delay="0.4s">
            <div class="mask1"><img src="images/pic5.jpg" alt="image" class="img-responsive zoom-img"/></div>
            <p>酒店星级的划分以酒店的建筑、设施设备、功能及管理、服务水平为依据。具体的评定办法按照国家旅游局颁发的设施设备评定标准、设施设备的维修保养评定标准、清洁卫生评定标准，宾客意见评定标准等执行。
                <a th:href="@{/service/detail(id=1)}">查看详情</a></p>
            <div class="divider"></div>
            <p class="field-content">素雅旅馆</span></p>
        </div>
    </div>
</div>
<div th:include="footer :: th_footer"></div>
<script type="text/javascript">
    $(function () {
        $("#key").blur(function () {
            var key = $("#key").val();
            var type = $("#type").children('option:selected').val();
            location.href = "/service?key=" + key + "&type=" + type;
        });
        $("#type").change(function () {
            var type = $(this).children('option:selected').val();
            var key = $("#key").val();
            location.href = "/service?key=" + key + "&type=" + type;
        });
    });

</script>
</body>
</html>		